<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=640px,user-scalable=no,target-densitydpi=device-dpi" />
		<link rel="stylesheet" href="../css/css.css" type="text/css" />
		<script type="text/javascript" src='../js/jquery.min.js'></script>
		<script type="text/javascript" src='../js/main_in.js'></script>
		<script type="text/javascript" src='../js/common.js'></script>
		<script type="text/javascript" src='../js/jquery.qrcode.min.js'></script>
		<script>
			var array = {
                        "1" : {
                            'a' : 0,
                            'b' : 99,
                            'c' : 02,
                        },
                        "2" : {
                            'a' : 4,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "3" : {
                            'a' : 6,
                            'b' : 4,
                            'c' : 0,
                        },
                        "4" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "5" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 02,
                        },
                        "6" : {
                            'a' : 99,
                            'b' : 6,
                            'c' : 02, 
                        },
                        "7" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 02, 
                        },
                        "8" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "9" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "10" : {
                            'a' : 6,
                            'b' : 4,
                            'c' : 0, 
                        },
                        "11" : {
                            'a' : 6,
                            'b' : 6,
                            'c' : 0, 
                        },
                        "12" : {
                            'a' : 6,
                            'b' : 4,
                            'c' : 0, 
                        },
                        "13" : {
                            'a' : 0,
                            'b' : 99,
                            'c' : 0, 
                        },
                        "14" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "15" : {
                            'a' : 6,
                            'b' : 6,
                            'c' : 0, 
                        },
                        "16" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "17" : {
                            'a' : 6,
                            'b' : 4,
                            'c' : 0, 
                        },
                        "18" : {
                            'a' : 4,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "19" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "20" : {
                            'a' : 99,
                            'b' : 6,
                            'c' : 0, 
                        },
                        "21" : {
                            'a' : 6,
                            'b' : 99,
                            'c' : 0, 
                        },
                        "22" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "23" : {
                            'a' : 99,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "24" : {
                            'a' : 5,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "25" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "26" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "27" : {
                            'a' : 0,
                            'b' : 6,
                            'c' : 0, 
                        },
                        "28" : {
                            'a' : 0,
                            'b' : 6,
                            'c' : 02, 
                        },
                        "29" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "30" : {
                            'a' : 0,
                            'b' : 4,
                            'c' : 0, 
                        },
                        "31" : {
                            'a' : 6,
                            'b' : 0,
                            'c' : 0, 
                        },
                        "32" : {
                            'a' : 0,
                            'b' : 99,
                            'c' : 02, 
                        },
                    }
			var alt_a = '';
            var alt_b = '';
            var alt_c = '';
			$(function(){
				$("#preCarNum").click(function(){
                    $("#car_num_hide").show();
                });
                
                $(".car_num_text").click(function(){
                    $('.car_num_text').removeClass("car_num_class_add");
                    $(this).addClass("car_num_class_add");
                });
                
                $(".car_num_hang").click(function(){
                    $("#carcode_a").show();
                    $("#carcode_b").show();
                    
                    var alt = $(".car_num_class_add").attr('alt');
                    var head = $(".car_num_class_add").html();
                    $("#preCarNum").val(head)
                    $.each(array , function(k,v){
                        if(k == alt){
                            alt_a = v.a;
                            alt_b = v.b;
                            alt_c = v.c;
                        }
                    });
                    if(alt_a == 0){
                        $("#carcode_a").hide();
                    }else if(alt_a == 99){
                        $("#carCode").attr("placeholder","请输入完整车架号");
                    }else{
                        $("#carCode").attr("placeholder","请输入后"+alt_a+"位");
                    }
                    
                    if(alt_b == 0){
                        $("#carcode_b").hide();
                    }else if(alt_b == 99){
                        $("#carEngineCode").attr("placeholder","请输入完整发动机号");
                    }else{
                        $("#carEngineCode").attr("placeholder","请输入后"+alt_b+"位");
                    }
                    
//                    if(alt_c == 0){
//                        
//                    }else{
//                        $("option[val=02]").hide()
//                    }
                    
                    $("#car_num_hide").hide();
                });
			})
			
			
            function search(){
            	$("#show_result").empty();
            	var search_type = $("#search_type").val();
                var carCode = $("#carCode").val();
                var carEngineCode = $("#carEngineCode").val();
                var carNumber = $("#carNumber").val();
                var carType = $("#carType").val();
                var preCarNum=$("#preCarNum").val();
                if(carNumber=='' || preCarNum==''){
                	alert('有必填项未填！');
                }
                var body = "?carCode=" + carCode + "&carEngineCode=" + carEngineCode + "&carNumber=" 
                			+ carNumber + "&carType=" + carType + "&s=" + search_type;
            	$.ajax({
            		url:"http://insure.unair.cn/api_s2_h.php" + body,
            		type: "GET",
            		data: {},
            		success: function(data) {
            			var data = eval("(" +data+ ")");
            			//alert(JSON.stringify(data));
            			var msg=data['showapi_res_body']['msg'];
            			var item = "<div style='width:90%;' class='main_in_input_hide_main'>" +
		                                    "<div class='main_in_input_hide_child over_1' >"+msg+"</div>" +
		                                "</div>"
      			
            			$("#show_result").append(item)
            		},
            		error:function(data){
            			alert(data);
            		}
            	})
            }
		</script>
	</head>
	<body>
		<div class="app_head">
			<div class="app_prev" onclick="clicked('./myinfo.html')"><img src="../img/arrow.png" /></div>
            <div class="app_head_text">违章查询</div>
            <div class="app_share" ></div>
       </div>
       <div class="app_body">
            <div class="main_in_input">
                <div class="main_in_input_text_left">车辆归属地：</div>
                <div class="main_in_input_prev"><input style="text-align: center;font-size: 26px;" type="text" id="preCarNum" value="" readonly /></div>
                <div style="width: 40%;" class="main_in_input_prev">
                    <select style="margin-top: 25px;" class="app_input_text" id="search_type">
                        <option value="2.2">常规车辆违章查询</option>
                        <option value="2.1">新能源车违章查询</option>
                    </select>
                </div>
            </div>

            <div style="display: none" id="car_num_hide" class="app_body">
                <div style="color: red;margin-left: 5%;font-size: 1.4em;">暂仅支持以下省份车辆违章信息查询</div>
                <div class="car_num_hang">
                    <div class="car_num_text" alt="1">京</div>
                    <div class="car_num_text" alt="2">冀</div>
                    <div class="car_num_text" alt="3">宁</div>
                    <div class="car_num_text" alt="4">川</div>
                </div>
                <div class="car_num_hang">    
                    <div class="car_num_text" alt="31">新</div>
                    <div class="car_num_text" alt="32">沪</div>
                    <div class="car_num_text" alt="28">苏</div>
                    <div class="car_num_text" alt="5">浙A-C</div>
                </div>
                <div class="car_num_hang">  
                    <div class="car_num_text" alt="6">浙D</div>
                    <div class="car_num_text" alt="7">浙E-L</div>
                    <div class="car_num_text" alt="8">渝</div>
                    <div class="car_num_text" alt="9">皖</div>
                </div>
                <div class="car_num_hang">    
                    <div class="car_num_text" alt="10">粤A</div>
                    <div class="car_num_text" alt="11">粤B</div>
                    <div class="car_num_text" alt="12">粤C-Y</div>
                    <div class="car_num_text" alt="13">蒙M</div>
                </div>
                <div class="car_num_hang">    
                    <div class="car_num_text" alt="14">豫</div>
                    <div class="car_num_text" alt="15">辽A</div>
                    <div class="car_num_text" alt="16">辽B</div>
                    <div class="car_num_text" alt="17">辽C</div>
                </div>
                <div class="car_num_hang">    
                    <div class="car_num_text" alt="18">辽D</div>
                    <div class="car_num_text" alt="19">辽E-G</div>
                    <div class="car_num_text" alt="20">辽H</div>
                    <div class="car_num_text" alt="21">辽J</div>
                </div>
                <div class="car_num_hang">    
                    <div class="car_num_text" alt="22">辽K-N</div>
                    <div class="car_num_text" alt="23">辽P</div>
                    <!--<div class="car_num_text" alt="24">鄂</div>-->
                    <div class="car_num_text" alt="25">鄂</div>
                    <div class="car_num_text" alt="26">闽</div>
                </div>
                <div class="car_num_hang">  
                    <div class="car_num_text" alt="27">陕</div>
                    <!--<div class="car_num_text" alt="29">鲁</div>-->
                    <div class="car_num_text" alt="30">鲁</div>

                </div>
                <!--            <div class="car_num_hang">
                                <div class="car_num_button" id="car_num_button">确认</div>
                            </div>-->
            </div>

            <div id="carcode_a" class="main_in_input">
                <div class="main_in_input_text_left">车架号：</div>
                <div class="main_in_input_input_right"><input type="text" id="carCode" value="" placeholder="" /></div>
            </div>
            <div id="carcode_b" class="main_in_input">
                <div class="main_in_input_text_left">发动机号：</div>
                <div class="main_in_input_input_right"><input type="text" id="carEngineCode" value="" /></div>
            </div>
            <div class="main_in_input">
                <div class="main_in_input_text_left">完整车牌号：</div>
                <div class="main_in_input_input_right"><input type="text" id="carNumber" value="" placeholder="如：粤B4Q5X8" /></div>
            </div>
            <div class="main_in_input">
                <div class="main_in_input_text_left">车辆类型：</div>
                <div class="main_in_input_input_right">
                    <select style="margin-top: 25px;" class="app_input_text" id="carType">
                        <option value="01">大型汽车</option>
                        <option value="02">小型汽车</option>
                        <option value="15">挂车</option>
                        <option value="22">临时行驶车</option>
                        <option value="24">其它车型</option>
                    </select>
                </div> <!--1,2,15,22,24-->
            </div>
            <div class="app_submit" onclick="search()">查&nbsp;询</div>
            <div id="show_result" class="show_result"></div>
        </div>
	</body>
</html>
